<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="csrf-token" content="{:token()}">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登录</title>
    <link rel="stylesheet" href="/static/admin/css/login.css">
    <script src="/static/admin/js/jquery-1.8.1.min.js"></script>
    <!-- 作者QQ:951252660 -->
</head>

<body>
    <div class="login">
        <div class="center">
            <h1>Login</h1>
            <div class="inputLi">
                <strong>账户</strong>
                <input type="text" placeholder="请输入" name="username" id="username">
                <span style="color: red"></span>
            </div>
            <div class="inputLi">
                <strong>密码</strong>
                <input type="text" placeholder="请输入" name="password" id="password">
                <span style="color: red"></span>
            </div>
            <div class="inputLi">
                <strong>验证码</strong>
                <input type="text" placeholder="请输入" name="code" id="code">
                <div><img src="{:captcha_src()}" alt="captcha" /></div>
            </div>
            <div class="inputLi">
                <button>登录</button>
            </div>
            <p class="tip">关注2004A</p>
        </div>
    </div>
</body>

<script>

    $("#username").blur(function () {
        // 获取当前文本框的值
        let username = $(this).val();
        // 编写正则表达式// 数字字母下划线
        let preg = /^\w{2,}$/;
        console.log(preg.test(username))
        if (!preg.test(username)) {
            $(this).next().text("用户名长度至少2位");
        } else {
            $(this).next().text("ok");
        }
    })
    $("#password").blur(function () {
        // 获取当前文本框的值
        let password = $(this).val();
        // 编写正则表达式// 数字字母下划线
        let preg = /^\w{6,}$/;
        if (!preg.test(password)) {
            $(this).next().text("用户名长度至少6位");
        } else {
            $(this).next().text("ok");
        }
    })

    // ajax 登录
    $('button').click(function () {
        // let  username = $("#username").val();//通过id选择器、选则元素
        let username = $("input[name='username']").val();
        let password = $("input[name='password']").val();
        if (username == '' || username.length < 3) {
            alert("用户名不合法");return false;
        }
        if (password == '') {
            alert("用户名不能为空");return false;
        }
        // 发送请求
        $.ajax({
            url:'/admin/doLogin',
            data:{username:username,password:password},
            dataType:"json",
            type:"post",
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            success:function (response) {
                console.log(response);
                if (response.code == 200) {
                    // 登录成功之后、跳转到商品列表页面
                    location.href='/admin/goodsList';
                } else {
                    alert(response.msg);
                }
            }
        });
    })
</script>

</html>